<script setup>
import { ref } from 'vue'

const showTop = ref(false)
const show = () => {
    if (showTop.value === false) {
        showTop.value = true
    } else {
        showTop.value = false
    }
}
</script>
<template>
    <div class="header">
        <img class="img" src="/image/logo.png" alt="">
        <van-icon name="wap-nav" @click="show" class="btn" size="20" />
    </div>
    <van-popup v-model:show="showTop" position="top" z-index="3" :style="{ height: '120px' }">
        <div class="white"></div>
        <div class="h-list">证书认证查询</div>
    </van-popup>
    <router-view></router-view>
</template>
<style scoped>
.header {
    z-index: 999;
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 60px;
    background-color: white;

    .img {
        margin-left: 16px;
        width: 142px;
        height: 24px;
    }

    .btn {
        margin-right: 16px;
    }

}

.white {
    width: 100%;
    height: 60px;
    background-color: white;
}

.h-list {
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #262626;
    padding-left: 16px;
    line-height: 60px;
    background-color: #FAFAFA;
}
</style>